@import "../modules/variables.scss";
@import "../modules/mixin.scss";
@import "../modules/public-client-index.scss";
@import "../modules/rating.scss";
@import "../modules/bootstrap-spinner.scss";
/*nav*/
.navbar-label{
  line-height: 60px;
  padding-left: 40px;
  >.label{
    position: relative;
    top: -2px;
    background: $color-error ;
    color: #fff;
  }
}
.navbar-form{
  width: 13em;
}
.ci-main-nav{
  @include nav-pills-blank(#000,$black-1);
  font-size: 2.4rem;
  padding:44px 0;
  >li+li{
    margin-left: 0;
  }
}
/*end nav*/


/*header*/
.header-carousel{
  min-height: 500px;
}
.client-carousel-caption{
  top: 16.8%;
  bottom:auto;
  >h1{
    font-size: 4.2rem;
  }
  >h5{
    font-size: 2rem;
    margin-top: 25px;
    margin-bottom: 0;
  }
  .btn-fill-red{
    padding-left: 32px;
    padding-right: 32px;
    background: #ff005a;
    margin-top: 40px;
    &:hover{
      background: #fff;
      border-color: #ff005a;
      color: #ff005a;
    }
  }
}
.carousel-control{
  width: 8%;
  .fa{
    position: absolute;
    top: 50%;
    z-index: 5;
    font-size: 7rem;
    margin-top: -35px;
  }
  &.left{
    .fa{
      left: 50%;
    }
  }
  &.right{
    .fa{
      right: 50%;
    }
  }
}
.carousel-inner{
  background: #000;
  >.item{
    overflow: hidden;
  }
  >.item>.item-img{
    opacity:0.56;
    max-width: none;
    min-height: 100%;
  }
}
/*end header*/


/*footer*/
footer{
  padding:45px 0 55px;
  background: $client-bg;
  border-top:1px solid #ced6dd;
  .footer-nav{
    li{
      margin-top: 5px;
      margin-bottom: 5px;
      font-size: 1.6rem;
    }
    a{
      color: $black-2;
    }
  }
  .copyright{
    margin-top: 60px;
  }
  .footer-log{
    li{
      padding-left: 10px;
      padding-right: 10px;
    }
    a{
      color: $black-1;
      &:hover{
        color: #000;
      }
    }
    .fa{
      font-size: 2.6rem;

    }
  }
}
.footer-title{
  @include PTSerif;
  font-size: 2rem;
  padding-bottom: 10px;
  margin-bottom: 10px;
  &:after{
    content: '';
    display: block;
    width: 120px;
    height: 1px;
    background: #bfbfbf;
    position: relative;
    top: 8px;
  }

}


/*breadcrumb*/
.breadcrumb{
  @include PTSerif;
  color: $black-1;
  padding:29px 0;
  margin-bottom: 0;
  a{
    font-size: 1.6rem;
    color: $black-1;
  }
  .active{
    color: $pink;
  }
}
.section-breadcrumb{
  background: $client-bg;
}
.section-title{
  @include PTSerif;
  font-size: 2.4rem;
  &:after{
    content:"";
    display: block;
    width: 100px;
    height: 2px;
    background: #000;
    position: relative;
    top: 3px;
  }
}
.section-content-title{
  margin-top: 25px;
  margin-bottom: 50px;
}
.section-blog-title{
  margin-top: 30px;
  margin-bottom: 40px;
  .form-group{
    margin-bottom: 0;
  }
}
/*pagination*/
.pagination{
  margin: 10px 0 0;
  font-size: 1.6rem;

  >li>a{
    color: $black-1;
    padding: 8px 14px;
  }
  .active >a{
    border-color: $black-1;
    background: $black-1;
    color: #fff;
    &:hover{
      border-color: lighten($black-1,6%);
      background: lighten($black-1,6%);
      color: #fff;
    }
  }
}


.thumbnail{
  margin-bottom: 50px;
  .caption{
    padding: 0;
    font-size: 1.6rem;
  }
  .btn-fill-default{
    font-size: 1.6rem;
    padding-left: 2em;
    padding-right: 2em;
  }
}
.thumbnail-title{
  font-size: 2rem;
  a{
    color: $black-1;
  }
  @include PTSerif;
  margin-top: 15px;
  margin-bottom: 10px;
}
.thumbnail-content{
  margin-top: 20px;
  margin-bottom: 25px;
  a{
    color: $black-2;
  }
}
.thumbnail-author{
  span{
    color: $black-2;
  }
}

.article-caption{
  .title{
    margin-top: 25px;
    margin-bottom:8px;
    @include PTSerif;
    font-size: 2rem;
  }
  .author{
    margin-bottom: 25px;
    font-size: 1.6rem;
  }
}
.thumbnail{
  article{
    p{
      margin-bottom: 15px;
      font-size: 1.6rem;
    }
    margin-bottom: 30px;
  }
}
/*section-shop*/
.section-shop{
  .form-control{
    height: 38px;
    font-size: 1.6rem;
    @include PTSerif;
  }
  .select-caret{
    line-height: 36px;
    width: 36px;
    height: 36px;
    right:1px;
  }
}

/*details-slider*/
$slideWidth:500px;
.section-product-info{
  .details-slide-for{
    max-width:$slideWidth;
  }
  .details-slider-nav{
    width:511px;
  }
  .details-slider{
    max-width: $slideWidth;
    overflow: hidden;
  }
}
/*zoom*/
.zoomDiv{
  z-index:999;
  position:absolute;
  top:0px;
  left:0px;
  background:#ffffff;
  border:1px solid #CCCCCC;
  display:none;
  text-align:center;
  overflow:hidden;
}
.zoomMask{
  position:absolute;
  background:url("../../images/mask.png") repeat scroll 0 0 transparent;
  cursor:move;
  z-index:1;
}
.details-slider{
  .slick-prev{
    left:5px;
  }
  .slick-next{
    right: 15px;
  }
  .slick-prev,.slick-next{
    z-index:2;
  }
  .slick-prev:before,.slick-next:before{
    color: $pink;
  }
}
.details-slide-for{
  overflow: hidden;
  position: relative;
  z-index:1;
  .fa-search-plus{
    color: #fff;
    background: #ccc;
    background: rgba(0,0,0,0.15);
    position: absolute;
    right:0;
    bottom: 0;
    padding:4px;
  }
  a{
    display: block;
  }
  img{
    width: 100%;
    height: 100%;
  }
}

.details-slider-nav{
  margin-top: 15px;
  img{
    width: 90px;
    height: 90px;
    margin: 0;
  }
}
/*productDetails*/
.section-product-title{
  font-size: 1.6rem;
  margin-top: 30px;
  margin-bottom: 35px;
}
.line-through{
  text-decoration: line-through;
}

.details-content{
  font-size: 1.6rem;
  .input-group-addon{
    background: #fff;
    a,a:hover,a:focus,a:active{
      color: $black-1;
    }
  }
  .share{
    >span{
      float: left;
    }
    >ul{
      float: left;
      padding-left: 15px;
    }
    li{
      border:1px solid #d2d2d2;
      padding: 0;
      text-align: center;
    }
    a{
      color: $black-1;
      display: inline-block;
      width: 25px;
      height: 25px;
      font-size: 2rem;
      line-height: 25px;
      .fa-google-plus{
        font-size: 1.7rem;
      }
      &:hover{
        color: $black-3;
      }
    }
  }
  .details-main-list{
    margin-bottom: 30px;
  }
  .form-control{
    font-size: 1.6rem;
    height: 40px;
  }
  .btn-follow,.btn-fill-primary{
    font-size: 1.8rem;
    height: 40px;
  }
  .btn-follow{
    border:1px solid #d2d2d2;
    padding:6px 10px;
    color: $black-2;
    &:hover,&.focus{
      color: $pink;
      background: #fff;
    }
  }
  .title{
    @include PTSerif;
    font-size: 2.4rem;
    margin-bottom: 10px;
  }
  .original-price{
    color: $black-2;
  }
  .promotional-price{
    margin-bottom: 10px;
    >strong{
      font-size: 3rem;
      font-weight: normal;
    }
  }
  .availability{
    >strong{
      font-weight: normal;
    }
  }
  .control-label{
    font-weight:400;
  }
}
/*section-description*/
.section-description{
  margin-top: 50px;
  .nav-tabs{
    border-width: 1px;
    border-color: #d2d2d2 #d2d2d2 #fff #d2d2d2;
    border-style:solid;
    font-size: 1.6rem;
    >li{
      &:before{
        content: '';
        display: block;
        position: relative;
        width: 100%;
        height: 2px;
        background: #fff\9;
        background: transparent;
        top: -1px;
        left: 0;
      }
    }
    .active{
      //border
      &:before{
        background: $pink;
      }
    }
    .active>a,.active>a:hover,.active>a:focus,.active>a:active{
      color:$pink;
      border:none;
    }
    >li>a{
      color: $black-2;
      border:none;
      padding:18px 30px;
    }
  }
  .tab-content{
    border-width: 1px;
    border-color: #d2d2d2;
    border-style:solid;
    padding:20px 30px 30px;
    p{
      font-size: 1.6rem;
      color: $black-2;
      line-height: 1.8em;
    }
  }
  .tab-pane-title{
    @include PTSerif;
    font-size: 2.4rem;
    margin-bottom: 15px;
  }
}

.section-more{
  margin-top: 55px;
  .section-title{
    &:after{
      display: none;
    }
  }
  .commodity-list-group{
    margin-top: 25px;
    margin-bottom: 0;
  }
}

.pagination-sm{
  margin-top: 0;
  >li>a{
    padding:4px 9px;
    font-size: 1.8rem;
    line-height: 1.8rem;
  }
}
#description{
  padding-bottom: 15px;
}
#reviews{
  h4{
    font-size: 1.6rem;
    @include PTSerif;
  }
  .control-label{
    font-weight: normal;
  }
  .form-control{
    height: 40px;
  }
  .main-form{
    .control-label,.form-control{
      font-size: 1.8rem;
    }
  }
  .control-label.fl{
    color: $black-2;
    font-size: 1.6rem;
    line-height: 1.3;
    margin-right: 20px;
  }
  .fieldset-title{
    font-size: 2rem;
    margin-bottom: 10px;
  }
  .fieldset-list{
    >li{
      border:1px solid #d2d2d2;
      padding:20px 20px 15px;
      margin-bottom: 20px;
    }
  }
  .fieldset-list-header{
    margin-bottom: 15px;

  }
  .fieldset-list-author{
    color: $black-2;
    font-size: 1.6rem;
    .name{

    }
  }
  .filedset-list-content{
    color: $black-2;
  }
  .btn-fill-default{
    @include padding-lr(2.6rem);
  }
}
#follow-wrapper{
  position: absolute;
  left: -9999px;
  width: 0;
  height: 0;
  top: -9999px;
}